﻿<!DOCTYPE html>
<html>
<head>
    <title>CGI</title>
</head>
<body>
    <h1>Our Page</h1>
    <script>
        //01

        //this is sets to some object in the global namespace, but what object (window)
        console.log(typeof this);
        //this is also same as window for browsers
        console.log(this === window);
        //in global area all "name", "this.name" & "window.name" are same
        var name = 'Jeff';
        console.log(this.name);


        //02
        //this within a function
        //true, when we call function like below in the global namespace,this still gets assigned to window
        /*
        var updateSalary = function () {
            console.log(this === window);
        };
        updateSalary();
        */

        //03
        //object "employee" creates here with JSON notation,has function updateSalary
        /*
        var employee = {
            name: 'Jeff',
            updateSalary: function () {
                console.log(this);
            }
            //here "this" will assign the actual object that calls the function, employee
        };
        employee.updateSalary();
        */

        //04
        //function "fn" within function "updateSalary"
        //within "updateSalary" function we're calling "fn" function, then we call updateSalary function
        /*
        var employee = {
            name: 'Jeff',
            updateSalary: function () {
                var fn = function () {
                    console.log(this);
                    console.log(this === window);
                };
                fn();
            }
        };
        //here we get our window object
        //when we calling "updateSalary", we're calling fn() function and no object is attached to this function, hence global object, window
        employee.updateSalary();
        */

        //05
        // here we have constructor function called "Address" with 1 argument line1
        //then we new up the "Address"
        /*
        var Address = function (line1) {
            this.line1 = line1;
            console.log(this);
        };
        //here we get out object "Address", "this" gets assigned new brand new object here
        var addr = new Address('123 State St.');
        */

        //06
        //even we call function attched to prototype, "this" will assigned to real object "Address"
        /*
        var Address = function (line1) {
            this.line1 = line1;
        };
        Address.prototype.updateZipCode = function () {
            console.log(this);
        };
        var addr = new Address('123 State St.');
        addr.updateZipCode();
        */
    </script>
</body>
</html>